import React, {Component} from 'react';
import styled from '../styled.less';
import {getQueryString} from '@/utils/util';
import {getDeviceOutdoorFireHydrantDetail} from '../service';

export default class WaterDetailHeaderLeft extends Component {

  state = {
    id: getQueryString('id'),
    outdoorFireHydrantDetail: {}
  };

  componentWillMount() {
    getDeviceOutdoorFireHydrantDetail(this.state.id).then(data => {
      this.setState({
        outdoorFireHydrantDetail: data
      })
    });
  }

  render () {
    return (
      <div className="head-left">
        <ul className={styled.detail_head_left}>
          <li>设备名称：{this.state.outdoorFireHydrantDetail['name'] ? this.state.outdoorFireHydrantDetail['name'] : '-'}</li>
          <li>安装地址：{this.state.outdoorFireHydrantDetail['installLocation'] ? this.state.outdoorFireHydrantDetail['installLocation'] : '-'}</li>
          <li>安装时间：{this.state.outdoorFireHydrantDetail['installationTime'] ? this.state.outdoorFireHydrantDetail['installationTime'] : '-'}</li>
          <li>电压：{this.state.outdoorFireHydrantDetail['valueMap'] ? this.state.outdoorFireHydrantDetail['valueMap']['pressure'] ? this.state.outdoorFireHydrantDetail['valueMap']['pressure'] : '-' : '-'}</li>
          <li>联网方式：{this.state.outdoorFireHydrantDetail['outdoorFireHydrantOnlineTypeName'] ? this.state.outdoorFireHydrantDetail['outdoorFireHydrantOnlineTypeName'] : '-'}</li>
          <li>盖帽：{this.state.outdoorFireHydrantDetail['blockShotName'] ? this.state.outdoorFireHydrantDetail['blockShotName'] : '-'}</li>
          <li>阀门状态：{this.state.outdoorFireHydrantDetail['valveStatusName'] ? this.state.outdoorFireHydrantDetail['valveStatusName'] : '-'}</li>
          <li>设备ID：{this.state.outdoorFireHydrantDetail['networkAddr'] ? this.state.outdoorFireHydrantDetail['networkAddr'] : '-'}</li>
          <li>型号：{this.state.outdoorFireHydrantDetail['productName'] ? this.state.outdoorFireHydrantDetail['productName'] : '-'}</li>
          <li>状态：{this.state.outdoorFireHydrantDetail['runStatusName'] ? this.state.outdoorFireHydrantDetail['runStatusName'] : '-'}</li>
          <li>厂家：{this.state.outdoorFireHydrantDetail['brandName'] ? this.state.outdoorFireHydrantDetail['brandName'] : '-'}</li>
          <li>水压：{this.state.outdoorFireHydrantDetail['valueMap'] ? this.state.outdoorFireHydrantDetail['valueMap']['voltage'] ? this.state.outdoorFireHydrantDetail['valueMap']['voltage'] : '-' : '-'}</li>
          <li>接收时间：{this.state.outdoorFireHydrantDetail['receiveTime'] ? this.state.outdoorFireHydrantDetail['receiveTime'] : '-'}</li>
        </ul>
      </div>
    )
  }
}
